<template>
  <div class="category-test">
	<h1>当前的和为{{ sum }}</h1>
	<h1>当前的和为{{ big }}</h1>
	<h1>我在{{ where }}学{{ what }}</h1>
	<select v-model="n">
		<option :value="1">1</option>
		<option :value="2">2</option>
		<option :value="3">3</option>
	</select>
	<button @click="increment(n)">++</button>
	<button @click="decrement(n)">--</button>
	<button @click="incrementOdd(n)">当前数为奇数</button>
	<button @click="incrementWait(n)">等一等再</button>
  </div>
</template>

<script>
import {mapState,mapGetters} from 'vuex'
import {mapActions} from 'vuex'
export default {
name: 'CountText',
data(){
	return {
		n:1,
	}
},
computed:{
// he(){
// 	return this.$store.state.sum
// },
// bigSum (){
// return this.$store.getters.bigSum
// },
// where (){
// return this.$store.state.where
// },
// what (){
// return this.$store.state.what
// },
...mapState(['sum','where','what']),
...mapGetters({big:'bigSum'}),
},
mounted(){

},
methods:{
// 	increment(){
// 		this.$store.dispatch('jia',this.n)
// 	},
// decrement(){
// 	this.$store.dispatch('jian',this.n)
// },
// incrementOdd(){
// 	this.$store.dispatch('jiaOdd',this.n)
// },
// incrementWait(){
// 	this.$store.dispatch('jiaWait',this.n)
// }
...mapActions({increment:'jia',decrement:'jian',incrementOdd:'jiaOdd',incrementWait:'jiaWait'})
}
}
</script>

<style>
button{
	margin-left: 5px;
}
</style>